<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>登陆失败</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <style>
        body {
            margin: 0;
            padding: 0;
            height: 100vh; /* 使用视口高度 */
            width: 100%;
            background-image: url(img/service/top-service.jpg);
            background-repeat: no-repeat;
            background-size: cover; /* 或者使用 'contain' */
            background-position: center center; /* 使图片在容器中居中 */
            display: flex; /* 使用 Flexbox 布局 */
            justify-content: center; /* 水平居中 */
            align-items: center; /* 垂直居中 */
            font-family: Arial, sans-serif; /* 设置全局字体 */
        }
        a {
            color: #666;
            text-decoration: none;
        }
        #main {
            padding: 20px 50px;
            background-color: rgba(0, 0, 0, 0.8); /* 使用半透明背景 */
            width: 500px;
            height: 200px;
            border-radius: 20px;
            text-align: center;
            display: flex; /* 使用 Flexbox 布局 */
            flex-direction: column; /* 垂直排列子元素 */
            justify-content: center; /* 垂直居中 */
            align-items: center; /* 水平居中 */
            color: floralwhite;
        }
        #main h3 {
            font-size: 24px; /* 调整字体大小 */
            margin: 10px 0; /* 添加间距 */
        }
        #main button {
            border: 0;
            padding: 10px 20px;
            border-radius: 20px;
            background-image: linear-gradient(to right, #b8cbb8 0%, #b8cbb8 0%, #b465da 0%, #cf6cc9 33%, #ee609c 66%, #ee609c 100%);
            color: white;
            font-size: 16px; /* 调整字体大小 */
            cursor: pointer;
        }
        #main button:hover {
            background-image: linear-gradient(to right, #cf6cc9 0%, #ee609c 100%); /* 鼠标悬停效果 */
        }
    </style>
</head>
<body>
<div id="main">
    <i class="fa fa-diamond fa-5x" style="color: #ed9db2;"></i>
    <h3>退出成功！</h3>
    <button th:onclick="'window.location.href=\'' + @{/index} + '\''">返回首页</button>
</div>
</body>
</html>
